<template>
  <div class="container">
    <el-card style="position: relative">
      <RouterHeader :title="titleStr()"></RouterHeader>
      <el-form
        :model="form"
        :rules="rules"
        ref="ruleFormRef"
        label-width="140px"
        label-position="right"
      >
        <el-row :gutter="20" class="form-single-info">
          <el-col :span="20">
            <div class="title"><h5>基本信息</h5></div>
            <el-row style="margin-left: 70px">
              <el-col :span="24">
                <el-descriptions>
                  <el-descriptions-item label="所属项目:">
                    <el-button
                      @click="correlation"
                      link
                      type="primary"
                      v-if="(route.query.name === '1') && userStore.rolescode!=15"
                      >点此关联</el-button
                    >
                    <el-button v-else link>{{ form.projectName }}</el-button>
                  </el-descriptions-item>
                </el-descriptions>
              </el-col>
              <el-col :span="8">
                <el-form-item label="项目名称" prop="projectName">
                  <el-input
                    class="input-item"
                    v-model="form.projectName"
                    placeholder="请输入"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="业主单位" prop="enterpriseName">
                  <el-input
                    class="input-item"
                    v-model="form.enterpriseName"
                    placeholder="请输入"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="项目联系人电话" prop="enterprisePhone">
                  <el-input
                    class="input-item"
                    v-model="form.enterprisePhone"
                    placeholder="请输入"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="项目联系人" prop="enterprisePerson">
                  <el-input
                    class="input-item"
                    v-model="form.enterprisePerson"
                    placeholder="请输入"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="行业" prop="industry">
                  <el-select
                    v-model="form.industry"
                    multiple
                    filterable
                    allow-create
                    default-first-option
                    :reserve-keyword="false"
                    placeholder="请输入"
                    style="width: 240px"
                    disabled
                  >
                    <el-option
                      v-for="item in industryDownOption"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="8">
                <el-form-item label="项目属性" prop="projectProperty">
                  <el-input
                    class="input-item"
                    v-model="form.projectProperty"
                    placeholder="请输入"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col> -->
              <el-col :span="8">
                <el-form-item label="业务类型" prop="businessType">
                  <el-cascader
                    v-model="form.businessType"
                    ref="ref_business"
                    :options="businesstypeTree"
                    :props="businesstProps"
                    :show-all-levels="false"
                    disabled
                  ></el-cascader>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="所在地区" prop="address">
                  <el-cascader
                    v-model="form.address"
                    :options="areaList"
                    :props="areaCodeprops"
                    ref="ref_areaCodes"
                    :show-all-levels="false"
                    disabled
                  ></el-cascader>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="审批部门" prop="approvalDept">
                  <el-select
                    class="input-item"
                    v-model="form.approvalDept"
                    placeholder="请选择"
                    multiple
                    filterable
                    allow-create
                    default-first-option
                    :reserve-keyword="false"
                    disabled
                  >
                    <el-option
                      v-for="item in approvaDeptOptions"
                      :key="item.id"
                      :label="item.label"
                      :value="item.id"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="监督部门" prop="superviseDept">
                  <el-select
                    class="input-item"
                    v-model="form.superviseDept"
                    placeholder="请选择"
                    multiple
                    filterable
                    allow-create
                    default-first-option
                    :reserve-keyword="false"
                    disabled
                  >
                    <el-option
                      v-for="item in superviseDeptOptions"
                      :key="item.id"
                      :label="item.label"
                      :value="item.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="8">
                <el-form-item label="优先级" prop="priority">
                  <el-select
                    v-model="form.priority"
                    clearable
                    placeholder="请选择"
                    style="width: 240px"
                    disabled
                  >
                    <el-option
                      v-for="item in priorityOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    />
                  </el-select>
                </el-form-item>
              </el-col> -->
              <el-col :span="24">
                <el-form-item label="项目简述" prop="projectBriefly">
                  <el-input
                    class="input-item"
                    type="textarea"
                    :autosize="{ minRows: 2 }"
                    show-word-limit
                    v-model="form.projectBriefly"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="项目备注" prop="projectRemark">
                  <el-input
                    class="input-item"
                    type="textarea"
                    :autosize="{ minRows: 2 }"
                    show-word-limit
                    v-model="form.projectRemark"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <div class="title" v-if="route.query.sealType === '0'">
              <h5>任务信息</h5>
            </div>
            <el-row v-if="route.query.sealType === '0'">
              <el-col :span="12">
                <el-form-item label="任务名称" prop="taskName">
                  <el-input
                    class="input-item"
                    v-model="form.taskName"
                    placeholder="请输入"
                    :disabled="
                      route.query.name === '3' ||
                      route.query.name === '5' ||
                      (route.query.name === '2' && route.query.task === '2') ||
                      (route.query.name === '2' &&
                        route.query.taskDetails === '2') ||
                      route.query.name === '6'
                    "
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="任务执行人" prop="taskExecutor">
                  <el-input
                    class="input-item"
                    v-model="form.taskExecutor"
                    placeholder="请输入"
                    disabled
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="任务说明" prop="taskDist">
                  <!-- :disabled="isDisabled()" -->
                  <el-input
                    class="input-item"
                    v-model="form.taskDist"
                    placeholder="请输入"
                    :disabled="
                      route.query.name === '3' ||
                      route.query.name === '5' ||
                      (route.query.name === '2' && route.query.task === '2') ||
                      route.query.name === '6' ||
                      (route.query.name === '2' &&
                        route.query.taskDetails === '2')
                    "
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="任务期限" prop="actualStartTime">
                  <!--  :disabled="isDisabled()"-->
                  <el-date-picker
                    v-model="datetime"
                    type="daterange"
                    range-separator="To"
                    start-placeholder="请选择"
                    end-placeholder="请选择"
                    format="YYYY-MM-DD"
                    value-format="YYYY-MM-DD"
                    :disabled-date="disabledDate"
                    :disabled="
                      route.query.name === '3' ||
                      route.query.name === '5' ||
                      (route.query.name === '2' && route.query.task === '2') ||
                      route.query.name === '6' ||
                      (route.query.name === '2' &&
                        route.query.taskDetails === '2')
                    "
                  />
                </el-form-item>
              </el-col>
              <!-- <el-col :span="12">
                <el-form-item label="业务类型" prop="businessTypeList">
                  <el-cascader
                    v-model="form.businessTypeList"
                    ref="ref_business"
                    :options="businesstypeTree"
                    :props="businesstProps"
                    :show-all-levels="false"
                    :disabled="isDisabled()"
                  ></el-cascader>
                </el-form-item>
              </el-col> -->
              <!-- <el-col :span="24">
                <el-form-item label="添加附件" prop="taskAnnexFiles">
                  <fileupload
                    @update:modelValue="handleModelValueFile"
                    :modelValue="form.taskAnnexFiles"
                    :flag="route.query.name === '4' ? true : false"
                  ></fileupload>
                </el-form-item>
              </el-col> -->
              <el-col :span="24">
                <el-form-item label="添加附件/图片">
                  <fileupload
                    @update:modelValue="handleModelValueTaskFile"
                    :modelValue="form.taskAnnexFiles"
                    :isShowTip="
                      (form.taskAnnexFiles &&
                        form.taskAnnexFiles.length === 5) ||
                      route.query.name === '6' ||
                      (route.query.name === '2' && route.query.task === '2') ||
                      route.query.name === '6' ||
                      (route.query.name === '2' &&
                        route.query.taskDetails === '2') ||
                      (route.query.name === '3' && route.query.task === '2')
                        ? false
                        : true
                    "
                    :flag="
                      (form.taskAnnexFiles &&
                        form.taskAnnexFiles.length === 5) ||
                      route.query.name === '6' ||
                      (route.query.name === '2' && route.query.task === '2') ||
                      route.query.name === '6' ||
                      (route.query.name === '2' &&
                        route.query.taskDetails === '2') ||
                      (route.query.name === '3' && route.query.task === '2')
                        ? true
                        : false
                    "
                  ></fileupload>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="是否盖章" prop="renwuwhethertostamp">
                  <el-radio-group
                    v-model="renwuwhethertostamp"
                    :disabled="
                      route.query.name === '3' ||
                      route.query.name === '5' ||
                      (route.query.name === '2' && route.query.task === '2') ||
                      route.query.name === '6' ||
                      (route.query.name === '2' &&
                        route.query.taskDetails === '2')
                    "
                  >
                    <el-radio :label="0">是</el-radio>
                    <el-radio :label="1">否</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>

              <el-col :span="8" v-if="renwuwhethertostamp === 0">
                <el-form-item label="盖章份数" prop="renwuhowabout">
                  <el-input
                    class="input-item"
                    v-model="renwuhowabout"
                    placeholder="请输入"
                    :disabled="
                      route.query.name === '3' ||
                      route.query.name === '5' ||
                      (route.query.name === '2' && route.query.task === '2') ||
                      route.query.name === '6' ||
                      (route.query.name === '2' &&
                        route.query.taskDetails === '2')
                    "
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8" v-if="renwuwhethertostamp === 0">
                <el-form-item label="盖章类型">
                  <el-select
                    v-model="renwuwhattypeDepts"
                    placeholder="请选择"
                    multiple
                    filterable
                    allow-create
                    default-first-option
                    :reserve-keyword="false"
                    :disabled="
                      route.query.name === '3' ||
                      route.query.name === '5' ||
                      (route.query.name === '2' && route.query.task === '2') ||
                      route.query.name === '6' ||
                      (route.query.name === '2' &&
                        route.query.taskDetails === '2')
                    "
                  >
                    <el-option
                      v-for="item in whatOptions"
                      :key="item.id"
                      :label="item.label"
                      :value="item.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="24">
                <el-form-item label="备注" prop="taskRemark">
                  <el-input
                    class="input-yijian"
                    type="textarea"
                    :autosize="{ minRows: 2 }"
                    show-word-limit
                    v-model="form.taskRemark"
                    placeholder="请输入内容"
                    :disabled="
                      route.query.name === '3' ||
                      route.query.name === '5' ||
                      (route.query.name === '2' && route.query.task === '2') ||
                      route.query.name === '6' ||
                      (route.query.name === '2' &&
                        route.query.taskDetails === '2')
                    "
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <div class="title" v-if="route.query.sealType === '1'">
              <h5>成果交付</h5>
            </div>
            <el-row v-if="route.query.sealType === '1'">
              <el-col :span="8">
                <el-form-item label="实际结束日期" prop="endDate">
                  <el-date-picker
                    v-model="form.endDate"
                    type="datetime"
                    placeholder="请选择日期"
                    style="width: 200px"
                    format="YYYY-MM-DD HH:mm:ss"
                    value-format="YYYY-MM-DD HH:mm:ss"
                    disabled
                    :disabled-date="disabledDate"
                  />
                </el-form-item>
              </el-col>

              <el-col :span="8">
                <el-form-item label="是否延期" prop="delayOrNot">
                  <el-radio-group v-model="delayOrNot" :disabled="true">
                    <el-radio :label="0">是</el-radio>
                    <el-radio :label="1">否</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row v-if="route.query.sealType === '1'">
              <el-col :span="8">
                <el-form-item label="是否盖章" prop="whethertostamp">
                  <el-radio-group v-model="whethertostamp" :disabled="true">
                    <el-radio :label="0">是</el-radio>
                    <el-radio :label="1">否</el-radio>
                  </el-radio-group>
                </el-form-item>
              </el-col>

              <el-col :span="8" v-if="whethertostamp === 0">
                <el-form-item label="盖章份数" prop="howabout">
                  <el-input
                    class="input-item"
                    v-model="howabout"
                    placeholder="请输入"
                    :disabled="true"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8" v-if="whethertostamp === 0">
                <el-form-item label="盖章类型">
                  <el-select
                    v-model="whattypeDepts"
                    placeholder="请选择"
                    multiple
                    filterable
                    allow-create
                    default-first-option
                    :reserve-keyword="false"
                    :disabled="true"
                  >
                    <el-option
                      v-for="item in whatOptions"
                      :key="item.id"
                      :label="item.label"
                      :value="item.id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>

            <el-row v-if="route.query.sealType === '1'">
              <el-col :span="24">
                <el-form-item label="任务反馈成果">
                  <fileupload
                    :modelValue="form.achievementAttachment"
                    @update:modelValue="taskModel"
                    :flag="false"
                  ></fileupload>
                  <!-- <el-input
                    v-model="form.feedback"
                    type="textarea"
                    :autosize="{ minRows: 2 }"
                    show-word-limit
                    placeholder="请输入"
                    clearable
                    :disabled="isDisabled()"
                  /> -->
                </el-form-item>
              </el-col>
            </el-row>

            <el-col :span="8">
              <el-form-item label="印章成果" prop="projectout">
                <el-radio-group
                  v-model="projectout"
                  :disabled="route.query.show"
                >
                  <el-radio :label="0">否</el-radio>
                  <el-radio :label="1">是</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>

            <div v-if="route.query.name !== '1'">
              <div class="title"><h5>项目审批进度</h5></div>
              <el-timeline style="max-width: 600px">
                <el-timeline-item
                  v-for="(activity, index) in activities"
                  :key="index"
                  :color="activity.color"
                  :timestamp="activity.updateTime"
                >
                  <div style="display: flex; align-items: center">
                    <img :src="url + activity.avatar" class="user-avatar" />
                    <span
                      style="
                        font-size: 14px;
                        font-weight: 500;
                        margin-left: 5px;
                      "
                    >
                      {{ activity.username }} ({{
                        activity.checkHisResult === "2" ? "未审核" : "已审核"
                      }})
                      {{
                        activity.zuofei === "0"
                          ? " _作废"
                          : activity.zuofei === "null"
                          ? ""
                          : ""
                      }}
                      :</span
                    >

                    <span
                      style="
                        font-size: 14px;
                        font-weight: 400;
                        margin-left: 5px;
                      "
                    >
                      {{ activity.opinion }}</span
                    >
                  </div>
                </el-timeline-item>
              </el-timeline>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item v-if="!route.query.show && userStore.rolescode!=15">
              <div style="width: 100%; display: flex; justify-content: center">
                <el-button @click="resetForm(ruleFormRef)"> 取消 </el-button>
                <el-button type="primary" @click="submitForm(ruleFormRef)"
                  >确定</el-button
                >
              </div>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-dialog v-model="dialogTableVisible" title="关联项目" width="1000">
        <PropTable
          :columns="column"
          :data="form.gridData"
          :total="total"
          :show="false"
          @reset="reset"
          @onSubmit="onSubmit"
          @handleSizeChange="handleSizeChange"
          @handleCurrentChange="handleCurrentChange"
          @exportExcelAction="exportExcelAction"
        >
          <template v-slot:projectCreateTime="scope">
            <div v-if="!useEmpty(scope.row.projectCreateTime)">
              {{ formatDate(scope.row.projectCreateTime) }}
            </div>
          </template>
          <template v-slot:operation="scope">
            <el-button
              link
              type="primary"
              size="small"
              @click="handleClick(scope.row)"
              v-if="userStore.rolescode!=15"
            >
              选择
            </el-button>
          </template>
        </PropTable>
      </el-dialog>
      <el-dialog
        title="新增成员"
        v-model="detailsvisible"
        :before-close="handleClose"
        width="60%"
        style="background: #fff; height: 100%; margin-bottom: 20px"
      >
        <selectPeople
          :projectUserDtoList="form.projectUserDtoList"
          @selectTable="selectTable"
          @deleteTable="deleteTable"
          @submitSelectForm="submitSelectForm"
          @handleSelectClose="handleSelectClose"
        ></selectPeople>
      </el-dialog>
    </el-card>
  </div>
</template>

<script setup >
import RouterHeader from "@/components/RouterHeader";
import { reactive, onMounted } from "vue";
import { useRoute, useRouter } from "vue-router";
import fileupload from "@/components/FileUpload";
import approver from "@/components/Approve/approver";
import PropTable from "@/components/Table/PropTable/index.vue";
import {
  delDetail,
  updateSealApi,
  detail,
  achievementDetail,
} from "@/api/seal/index";
import {
  approvalList,
  approvalQuery,
  industryDownApi,
} from "@/api/project/approval";

import { businessTypeList, location } from "@/api/project/conversion";
import { getUserProfile } from "@/api/system/user";
import { ElMessage } from "element-plus";
import { useEmpty, formatDate } from "@/utils/index";
import { taskDelivery } from "@/api/approvalManagement/approvaType.js";
import useUserStore from "@/store/modules/user";
const userStore = useUserStore();
let url = import.meta.env.VITE_APP_BASE_API;
const keepCheck = ref("1");
const route = useRoute();
const router = useRouter();
const dialogTableVisible = ref(false); // dialog关联对话框
const detailsvisible = ref(false); // 添加审批人对话框
const activities = ref([]);
const renwuwhethertostamp = ref();
const renwuwhattypeDepts = ref();
const renwuhowabout = ref();
// 优先级
const priorityOptions = [
  {
    value: "1",
    label: "最高",
  },
  {
    value: "2",
    label: "较高",
  },
  {
    value: "3",
    label: "较低",
  },
  {
    value: "4",
    label: "最低",
  },
];

// 监督部门
const superviseDeptOptions = [
  {
    id: "1",
    label: "住建",
  },
  {
    id: "2",
    label: "采购办",
  },
  {
    id: "3",
    label: "水利",
  },
  {
    id: "4",
    label: "交通",
  },
  {
    id: "5",
    label: "发改",
  },
  {
    id: "6",
    label: "环保",
  },
  {
    id: "7",
    label: "其他",
  },
];
// 审批部门
const approvaDeptOptions = [
  {
    id: "1",
    label: "生态环境局",
  },
  {
    id: "2",
    label: "行政审批局",
  },
  {
    id: "3",
    label: "经济发展局",
  },
  {
    id: "4",
    label: "发展改革局",
  },
  {
    id: "5",
    label: "其他",
  },
];

const whatOptions = [
  {
    id: "1",
    label: "项目公章",
  },
  {
    id: "2",
    label: "项目财务章",
  },
  {
    id: "3",
    label: "成果章",
  },
  {
    id: "4",
    label: "许平人员章",
  },
  {
    id: "5",
    label: "赵冲人员章",
  },
  {
    id: "6",
    label: "牛天敏人员章",
  },
  {
    id: "7",
    label: "李彦文人员章",
  },
  {
    id: "8",
    label: "合同章",
  },
  {
    id: "9",
    label: "法人章",
  },
];

const delayOrNot = ref(); // 是否延期
const projectout = ref(); //印章成果

const whethertostamp = ref(); //是否盖章
const howabout = ref();
const whattypeDepts = ref();
// const delayOrNotA=1

// 表单对象
const form = reactive({
  projectName: "", // 基本信息项目名称
  enterpriseName: "", //企业名称
  enterprisePhone: "", //项目联系人电话
  enterprisePerson: "", //项目联系人
  industry: [], // 行业
  projectProperty: "", //项目属性
  businessType: null, // 基本信息业务类型
  businessTypeList: [], // 任务信息业务类型
  address: "", //所在地区
  approvalDept: [], // 审批部门
  superviseDept: [], // 监督部门
  priority: "", //  优先级
  projectBriefly: "", //项目简述
  projectRemark: "", //项目备注
  taskName: "", // 任务名称
  createPerson: "", //创建人
  taskExecutor: "", // 任务执行人
  taskDist: "", // 任务说明
  actualStartTime: "", // 实际开始时间
  taskRemark: "", // 备注
  achievementAttachment: [], //  任务反馈成果
  endDate: "", // 实际结束时间
  taskAnnexFiles: [], // 成果附件
  selectTable: [], // 项目成员列表
  gridData: [], //  关联项目表格
  processCheckBo: {
    checkPeopleIds: [], //审核人id列表
    copyFor: [], //抄送人id列表
  },
  projectIds: "", // 项目id
  createBy: "", // 当前账号的ID
  updateBy: "",
  updateTime: "",
  approvalOpinions: "", // 审批意见
  processCheckHistoryId: "",
  approvalFiles: [],
});
// 表单验证
const rules = reactive({
  taskName: [
    {
      required: true,
      message: "请输入任务名称",
      trigger: "blur",
    },
  ],
  taskDist: [
    {
      required: true,
      message: "请输入任务说明",
      trigger: "blur",
    },
  ],
  actualStartTime: [
    {
      type: "daterange",
      required: true,
      message: "请选择实际开始日期",
      trigger: "change",
    },
  ],
  businessTypeList: [
    {
      required: true,
      message: "请选择业务类型",
      trigger: "change",
    },
  ],
  endDate: [
    {
      required: true,
      message: "请选择实际结束日期",
      trigger: "change",
    },
  ],
  feedback: [
    {
      required: true,
      message: "请输入任务反馈成果",
      trigger: "blur",
    },
  ],
});

const datetime = ref();
// 开始时间
const actualStartTime = ref();
// 结束时间
const Deadline = ref();

const titleStr = () => {
  if (route.query.name === "3") {
    return "印章";
  }
};
// 禁用今天之前的日期
const disabledDate = (time) => {
  // 使用JavaScript的Date对象来判断
  const today = new Date(new Date().setHours(0, 0, 0, 0));
  const currentTime = today.getTime();
  // 将time参数转换为时间戳，方便比较
  const timeValue = time.getTime();
  // 如果时间戳小于当前时间戳，则返回true，表示该日期被禁用
  return timeValue < currentTime;
};
const btnText = ref("");
// 按钮
const btnTextTab = () => {
  if (route.query.name === "3" && route.query.task === "2") {
    btnText.value = "提交";
  } else if (route.query.name === "6") {
    btnText.value = "通过";
  } else {
    btnText.value = "确认";
  }
};
const industryDownOption = ref([]);
// 获取行业下拉列表
const getindustryDown = async () => {
  const res = await industryDownApi();
  if (res.code === 200) {
    industryDownOption.value = res.data;
  }
};
btnTextTab();
// 获取用户信息
const getUser = async () => {
  const res = await getUserProfile();
  if (res.code === 200 && res.data) {
    form.taskExecutor = res.data.nickName;
    form.createBy = res.data.userId;
  }
};
const disabled = ref(true);

// 2.控制所有表单项是否只读
const isDisabled = () => {
  if (route.query.name === "3" && route.query.task === "2") {
    return (disabled.value = false);
  } else if (route.query.name === "3" && route.query.task === "3") {
    return (disabled.value = true);
  } else if (route.query.name === "3" && route.query.taskDetails === "2") {
    return (disabled.value = true);
  } else if (route.query.name === "6") {
    return (disabled.value = true);
  } else if (route.query.name === "5") {
    return (disabled.value = true);
  } else {
    return (disabled.value = false);
  }
};

// 成果交付添加附件
const handleModelValueTaskFile = (val, result, operationType) => {
  if (operationType === "success") {
    if (result) {
      form.taskAnnexFiles = [];
        result.forEach((item)=>{
          form.taskAnnexFiles.push(item);
        });
    }
  } else if (operationType === "delete") {
    form.taskAnnexFiles.splice(result, 1);
  }
};
// 审批附件
const handleModelValueFile = (val, result, operationType) => {
  if (operationType === "success") {
    if (result) {
      form.approvalFiles.push(result);
    }
  } else if (operationType === "delete") {
    form.approvalFiles.splice(result, 1);
  }
};

const taskModel = (val, result, operationType) => {
  if (operationType === "success") {
    if (result) {
      form.achievementAttachment = [];
      result.forEach((item)=>{
        form.achievementAttachment.push(item);
      });
    }
  } else if (operationType === "delete") {
    form.achievementAttachment.splice(result, 1);
  }
};
// 业务类型树形列表
const businesstypeTree = ref([]);
// 业务类型props配置
const businesstProps = {
  value: "id",
  label: "businessName",
  children: "children",
  // checkStrictly: true,
  multiple: true,
};
// 获取查询业务类型树形列表
const businessTypeOptions = async () => {
  const response = await businessTypeList();
  if (response.code === 200 && response.data.length > 0) {
    businesstypeTree.value = response.data;
  }
};
const column = [
  {
    name: "projectName",
    label: "项目名称",
    inSearch: true,
    valueType: "input",
  },
  { name: "projectId", label: "项目编号" },
  {
    name: "businessName",
    label: "业务类型",
    inSearch: true,
    valueType: "cascader",
    options: businesstypeTree,
    propsExpandTrigger: {
      value: "id",
      label: "businessName",
      checkStrictly: true,
      children: "children",
      emitPath: false,
    },
  },
  {
    name: "projectCreateTime",
    label: "创建时间",
    inSearch: true,
    valueType: "datetime",
    slot: true,
  },
  { name: "createPerson", label: "创建人" },
  { name: "operation", slot: true, label: "操作" },
];
// 全部地区列表
const areaList = ref([]);
const getareaList = async () => {
  const response = await location();
  if (response.code === 200 && response.data.length > 0) {
    areaList.value = response.data;
  }
};
// 全部地区配置
const areaCodeprops = {
  label: "name",
  children: "rcDistrictList",
  value: "id",
  // checkStrictly: true,
};
// 点此关联
const correlation = () => {
  dialogTableVisible.value = true; // 关联
  approvalData();
};
// 关联项目的列表
const pageNum = ref(1);
const pageSize = ref(10);
const total = ref(0);
let paramsSubmit;
const approvalData = async () => {
  let params = {
    pageNum: pageNum.value,
    pageSize: pageSize.value,
  };
  if (paramsSubmit) {
    for (let key in paramsSubmit) {
      if (paramsSubmit[key]) {
        params[key] = paramsSubmit[key];
      }
    }
  }
  const res = await approvalLists(params);
  if (res.code === 200 && res.rows.length >= 0) {
    form.gridData = res.rows;
    total.value = res.total;
  }
};
// 切换每页条数
const handleSizeChange = (valueSise) => {
  pageSize.value = valueSise;
  approvalData();
};
// 切换页码
const handleCurrentChange = (valuePage) => {
  pageNum.value = valuePage;
  approvalData();
};
// 点击查询
const onSubmit = (val) => {
  val.projectCreateTime = formatDate(val.projectCreateTime);
  paramsSubmit = val;
  approvalData();
};
// 点击重置
const reset = (val) => {
  val = "";
  approvalData();
};

let projectId;
const getTaskInfo = async () => {
  let id = Number(route.query.taskId) || route.query.sealId;
  const res = await delDetail(id);
  if (res.code === 200 && res.data) {
    for (let key in form) {
      if (res.data[key]) {
        form[key] = res.data[key];
      }
    }
    renwuwhethertostamp.value = res.data.renwuwhethertostamp;
    renwuwhattypeDepts.value = res.data.renwuwhattypeDepts;
    renwuhowabout.value = res.data.renwuhowabout;
    // 审批进度列表
    activities.value = res.data.dataCheckInfo?.opinons;
    projectId = res.data.projectId;
    // console.log(projectId, "---12---");
    // form.taskAnnexFiles

    form.taskAnnexFiles = res.data.taskAnnexFiles;
    datetime.value = [res.data.actualStartTime, res.data.Deadline];
    whethertostamp.value = res.data.whethertostamp;
    howabout.value = res.data.howabout;
    whattypeDepts.value = res.data.whattypeDepts;
    // 任务反馈
    form.businessTypeList = JSON.parse(res.data.businessTypes);

    delayOrNot.value = res.data.delayOrNot;
  }
};

// 任务印章的详情
// let projectId;
const taskInfo = async () => {
  let id = Number(route.query.taskId) || route.query.sealId;
  const res = await achievementDetail(id);
  if (res.code === 200 && res.data) {
    for (let key in form) {
      if (res.data[key]) {
        form[key] = res.data[key];
      }
    }
    renwuwhethertostamp.value = res.data.renwuwhethertostamp;
    renwuwhattypeDepts.value = res.data.renwuwhattypeDepts;
    renwuhowabout.value = res.data.renwuhowabout;
    // 审批进度列表
    activities.value = res.data.dataCheckInfo?.opinons;
    projectId = res.data.projectId;
    // console.log(projectId, "---12---");
    // form.taskAnnexFiles

    form.taskAnnexFiles = res.data.taskAnnexFiles;
    datetime.value = [res.data.actualStartTime, res.data.Deadline];
    whethertostamp.value = res.data.whethertostamp;
    howabout.value = res.data.howabout;
    whattypeDepts.value = res.data.whattypeDepts;
    // 任务反馈
    form.businessTypeList = JSON.parse(res.data.businessTypes);

    delayOrNot.value = res.data.delayOrNot;
  }
};

// 点击其他按钮需要的回显
const handleEcho = async () => {
  let params = {
    id: projectId || Number(route.query.id),
  };
  // let params={
  //   id: Number(route.query.id)
  // }

  const res = await approvalQuery(params);

  if (res && typeof (res === "object")) {
    form.projectName = res.data.projectName;
    form.enterpriseName = res.data.enterpriseName;
    form.enterprisePhone = res.data.enterprisePhone;
    form.enterprisePerson = res.data.enterprisePerson;
    form.industry = JSON.parse(res.data.industry);
    form.projectProperty = res.data.projectProperty;
    form.approvalDept = JSON.parse(res.data.approvalDept);
    form.superviseDept = JSON.parse(res.data.superviseDept);
    form.priority = res.data.priority;
    form.projectIds = res.data.proId;
    form.address = JSON.parse(res.data.address);
    form.businessType = res.data.test;
    form.projectBriefly = res.data.projectBriefly;
    form.projectRemark = res.data.projectRemark;
  }
  dialogTableVisible.value = false;
  flag.value = true;
};
// 是否关联项目
const flag = ref(false);
// 点此选择关联项目
const handleClick = async (row) => {
  let params = { id: row.proId };
  const res = await approvalQuery(params);
  if (res.code === 200 && typeof (res.data === "object")) {
    form.projectName = res.data.projectName;
    form.enterpriseName = res.data.enterpriseName;
    form.enterprisePhone = res.data.enterprisePhone;
    form.enterprisePerson = res.data.enterprisePerson;
    form.industry = JSON.parse(res.data.industry);
    form.projectProperty = res.data.projectProperty;
    form.approvalDept = JSON.parse(res.data.approvalDept);
    form.superviseDept = JSON.parse(res.data.superviseDept);
    form.priority = res.data.priority;
    form.projectIds = res.data.proId;
    form.address = JSON.parse(res.data.address);
    form.businessType = res.data.test;
    form.projectBriefly = res.data.projectBriefly;
    form.projectRemark = res.data.projectRemark;
  }
  dialogTableVisible.value = false;
  flag.value = true;
};

let ids;

const getTaskInfoS = async () => {
  let id = Number(route.query.ids) || route.query.sealId;
  const res = await detail(id);
  if (res.code === 200 && res.data) {
    ids = res.data.id;
    projectout.value =
      res.data.projectout === null
        ? 0
        : res.data.projectout && Number(res.data.projectout);

    // for (let key in form) {
    //   if (res.data[key]) {
    //     form[key] = res.data[key];
    //   }
    // }
    // if (
    //   route.query.name === "6" ||
    //   route.query.name === "3" ||
    //   route.query.name === "2" ||
    //   route.query.name === "5"
    // ) {
    //   ids = res.data.projectId;
    // }
    // form.taskAnnexFiles = res.data.taskAnnexFiles;
    // datetime.value = [res.data.actualStartTime, res.data.Deadline];
    // whethertostamp.value = res.data.whethertostamp;
    // howabout.value = res.data.howabout;
    // whattypeDepts.value = res.data.whattypeDepts;
  }
};
// 审批人
const handleChooseapprover = (id) => {
  if (id) {
    form.processCheckBo.checkPeopleIds = id;
    console.log(form.processCheckBo.checkPeopleIds);
  }
};
// 抄送人
const handleChooseapproverCc = (id) => {
  if (id) {
    form.processCheckBo.copyFor = id;
    console.log(form.processCheckBo.copyFor);
    console.log(form.processCheckBo.checkPeopleIds);
  }
};
// 如果是编辑或成果交付则不用关联项目
if (route.query.id && route.query.taskId) {
  flag.value = true;
}
// 新建任务
const ruleFormRef = ref();
const submitForm = async (formEl) => {
  if (!flag.value) {
    ElMessage.error("请关联项目");
  }
  if (!formEl) return;
  await formEl.validate(async (valid, fields) => {
    if (valid) {
      // 新建任务
      let params = {
        projectout: projectout.value,
        id: ids,
      };

      const res = await updateSealApi(params);

      if (res.code === 200) {
        ElMessage.success(res.msg);
        router.push({
          path: "/seal",
        });
      } else {
        ElMessage.success(res.msg);
      }
    } else {
      console.log("error submit!", fields);
    }
  });
};
// 取消
const resetForm = async (formEl) => {
  if (!formEl) return;
  formEl.resetFields();
  if (route.query.name !== "6") {
    router.go(-1);
  } else {
    let data = {
      checkOpinion: form.approvalOpinions,
      //   id: form.processCheckHistoryId,
      copyFor: form.processCheckBo.copyFor.map((item) => item.userId),
      keepCheckId: form.processCheckBo.checkPeopleIds.map(
        (item) => item.userId
      ),
      state: "0",
      fileList: form.approvalFiles,
      keepCheck: keepCheck.value,
    };
    const res = await taskDelivery(data);
    if (res.code === 200) {
      ElMessage.success("审批已驳回");
      router.go(-1);
    }
  }
};

onMounted(async () => {
  // console.log(projectout.value,'--projectout---')
  form.endDate = formatDate(new Date());

  // await getTaskInfo();

  await getTaskInfoS();
  if (route.query.name !== "1") {
    await handleEcho();
  }
  if (route.query.sealType === "0") {
    // 任务的详情
    await taskInfo();
  } else {
    await getTaskInfo();
  }

  await businessTypeOptions();
  await getareaList();
  await getUser();
  await getindustryDown();
  // projectout.value=1
});
</script>
<style scoped lang="scss">
.user-avatar {
  width: 40px;
  height: 40px;
  border-radius: 10px;
}
.container {
  padding: 20px;
}
.form-single-info {
  display: flex;
  justify-content: center;
}
.title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  h5 {
    font-weight: bold;
  }
}

.basic_attribute {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  align-items: center;
  div {
    width: 300px;
    line-height: 50px;
  }
}
</style>
